<template>
    <div class="app-container">
        <!--搜索框-->
        <el-form v-model="queryParams" size="small" :inline="true" label-width="68px">
            <el-form-item>
                <el-button type="primary" @click="getCloudPhoneList">获取云手机列表</el-button>
            </el-form-item>
            <el-form-item lable="云手机列表">
                <el-input type="text" v-model="executeADBcommandString"  style="width: 300px;"
                    placeholder="请输入ADB命令"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="executeADBcommand">执行输入的ADB命令</el-button>
            </el-form-item>
        </el-form>

        <!--数据展示-->
        <el-table :data="formData" style="width: 100%" :row-key="getRowKey" @select="handleSelect"
            @select-all="selectAllData">
            <el-table-column type="selection" width="50"></el-table-column>
            <el-table-column prop="id" align="center" label="云手机ID" />
            <el-table-column prop="name" align="center" label="云手机名称" />
            <el-table-column prop="status" align="center" label="状态">
                <template slot-scope="scope">
                    <div>{{ scope.row.status == 0 ? "未配置代理" :
                        scope.row.status == 1 ? "已开机" :
                            scope.row.status == 2 ? "已关机" :
                                scope.row.status == 3 ? "已过期" :
                                    scope.row.status == 4 ? "过期待续费" :
                                        scope.row.status == 10 ? "开机中" :
                                            scope.row.status == 11 ? "配置中" :
                                                scope.row.status == 12 ? "配置失败" : "未知" }}</div>
                </template>
            </el-table-column>
            <el-table-column prop="os" align="center" label="OS" />
            <el-table-column prop="size" align="center" label="大小" />
            <el-table-column prop="created_at" align="center" label="创建时间" />
            <el-table-column prop="expired_at" align="center" label="过期时间" />
            <el-table-column prop="ip" align="center" label="ip" />
            <el-table-column prop="area" align="center" label="地区" />
            <el-table-column prop="remark" align="center" label="备注" />
            <el-table-column prop="adb" align="center" label="adb" />
            <el-table-column prop="adb_password" align="center" label="adb密码" />
        </el-table>
        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pagesize" @pagination="getCloudPhoneList" />

    </div>
</template>

<script>
import {
    getCloudPhoneList,
    executeADBcommand
} from "@/api/phoneManage";

import { Notification, MessageBox, Message, Loading } from "element-ui";

import axios from "axios";
var date = new Date();
var fileS =
    date.getFullYear() + "/" + (date.getMonth() + 1) + "/" + date.getDate() + "/";

export default {

    data() {
        return {
            queryParams: {
                group_id: undefined,
                page: 1,
                pagesize: 10,
            },
            executeADBcommandString: "hideAccb com.sankuai.sailor.afooddelivery",
            total: 0,
            //表单提交数据
            title: "",
            //tableTitleJson: [],

            isReleaseData: [
                { label: "是", value: "1" },
                { label: "否", value: "0" },
            ],
            formData: [],
            selectedData: [], // 存储选中的数据
        };
    },

    created() {
        this.getCloudPhoneList();
    },
    methods: {
        getRowKey(row) {
            return row.id; // 每行数据的唯一标识
        },
        handleSelect(selection, row) {
            // 单行选择事件
            const index = this.selectedData.findIndex((item) => item.id === row.id);
            if (index > -1) {
                this.selectedData.splice(index, 1); // 如果已存在，则移除
            } else {
                this.selectedData.push(row); // 否则添加到选中数组
            }
            console.log("选择", this.selectedData.map(item => item.id).join(","))
        },
        selectAllData(val) {
            // 全部选中当前表格数据
            if (val.length) {
                // 选中数据中已有数据
                if (this.selectedData.length) {
                    for (let i in val) {
                        let index = this.selectedData.findIndex(item => item.id === val[i].id);
                        // 如果不存在与选中数据集，就添加，否则跳过
                        if (index == -1) {
                            this.selectedData.push(val[i]);
                        }
                    }
                } else {
                    val.forEach(row => {
                        this.selectedData.push(row);
                    })
                }
                console.log("全选", this.selectedData.map(item => item.id).join(","))
            } else {  // 取消全选
                this.selectedData = []
                console.log("取消全选", this.selectedData.map(item => item.id).join(","))
            }
        },
        beforeclose() {
            this.getCloudPhoneList();
            this.formQueryParams.page = 1;
            this.formQueryParams.pagesize = 10;
        },
        getCloudPhoneList() {
            getCloudPhoneList(this.queryParams).then((res) => {
                console.log("res", res)
                this.total = res.data.total;
                this.formData = res.data.list;
            });
        },
        executeADBcommand() {
            // console.log("executeADBcommandString",this.executeADBcommandString)
            // var params = {
            //     image_id: this.selectedData.map(item => item.id).join(","),
            //     command: this.executeADBcommandString
            // }
            // console.log("executeADBcommandString", params)
            this.selectedData.forEach(item=>{
                var params = {
                    image_id: item.id,
                    command: this.executeADBcommandString
                }
                console.log("pariams",params)
                executeADBcommand(params).then((res) => {
                    console.log("res", res)
                    if (res.data.success) {
                        Message.success("执行ADB命令成功")
                    } else {
                        Message.error(res.data.message)
                    }
                });
            })
            // executeADBcommand(params).then((res) => {
            //     console.log("res", res)
            //     if (res.data.success) {
            //         Message.success("执行ADB命令成功")
            //     } else {
            //         Message.error(res.data.message)
            //     }
            // });
        }
    },
};
</script>

<style scoped>
    
</style>
